﻿@{
  ViewData["Title"] = "Home Page";
  var list=ViewBag.ProductList;
}

<div class="row g-2">
    <div class="col-12 d-flex justify-content-between">
         <span>热卖商品标题</span>
         <span>
              <a class="text-decoration-none" asp-area="" asp-controller="Product" asp-action="Index">更多...</a>
            </span>
       </div>
@foreach(var p in list)
{   
    <div class="col-4">
         <div class="card mb-3" style="max-width: 540px;">
 <div class="row g-0">
   <div class="col-md-4">
     <img src="/upload/@p.Photo" class="img-thumbnail rounded-start" style="height:100%;width:100%">
   </div>
   <div class="col-md-8">
     <div class="card-body">
       <h5 class="card-title">@p.ProductName</h5>
       <div class="card-truncate-4" style="height:170px;">
          <p class="card-text">@p.ProductContent</p>
       </div>
        <div class="d-flex justify-content-between">
           <span class="text-danger">$@p.Price</span>
           <button class="btn btn-danger btn-shop-car" data-price="@p.Price" data-product-id="@p.ProductId">加入购物车</button>
        </div>
     </div>
   </div>
 </div>
         </div>
       </div>
}
</div>

</div>
@section CustomScript {
 <script lang="javascript">
 const handleAddShopCar = function () {
     let obj = $(this);
     let data = {
         price: obj.data("price"),
         productId: obj.data("product-id")
     }
     $.ajax({
       type: "post",
       url: "/shopcar",
       data: data,
       success: function (response) {
         customAlert(response)
       }
     });
 }
 $(document).ready(function () {
 $(".btn-shop-car").on("click", handleAddShopCar);
 });
 
 
   
 </script>
}